<?php get_header(); ?>

<script>
  var count = 0;
  var timeOut = null;
  
  $(document).ready(function(){
    var total = $("#slideshow .frame").length;
    
    (function autoAdvance(){
      // Schedulling a time out in 5 seconds.
      timeOut = setTimeout(autoAdvance,5000);
    
      // Simulating a click on the next arrow.
      $("#slideshow .frame").fadeOut('slow').promise().done(function(){
        if(count < total-1){
          count++;
        }else{ count=0; }
      
        $("#slideshow .frame").css('display', 'none');
        $("#slideshow .frame:eq("+count+")").fadeIn('slow');
      });
    })();

  });
</script>

<div class="content-top">
  <div class="wrapper">
    <div class="intro-title">
      <h3>WELCOME TO PT. MULTI MONODON INDONESIA</h3>
      <p class="description">Since xxxx, we have been providing outstanding service and valuable market information, while supplying quality seafood from around the world.</p>
    </div>
    
    <div id="slideshow" class="box rounded">
    <?php
      $slideshows = new Pod('slideshow');
      $slideshows->findRecords('name ASC');
      while($slideshows->fetchRecord()){ 
      $pic = $slideshows->get_field('picture');
    ?>
      <div class="frame">
        <a href="http://<?php echo $slideshows->data['link']; ?>">
          <div class="image">
            <img src="<?php echo $pic[0]['guid'] ?>" />
          </div>
        </a>
      </div>
    <?php } ?>
    </div>
  </div>
</div>

<div class="content-bottom">
  <div class="wrapper">
    <div class="first-col">
      <div class="icon"></div>
      <h3>SHIP WORLDWIDE</h3>
      <p>We ship to everywhere around the world</p>
      <a href="#">Read more</a>
    </div>
    
    <div class="first-col">
      <div class="icon"></div>
      <h3>FRESH & HEALTHY</h3>
      <p>Our products is 100% fresh & healthy</p>
      <a href="#">Read more</a>
    </div>
    
    <div class="first-col">
      <div class="icon"></div>
      <h3>CONTACT US</h3>
      <p>For more information, please contact us</p>
      <a href="#">Read more</a>
    </div>
    
    <div class="second-col">
      <div class="head">
        <div class="icon"></div>
        <h3>Popular Products</h3>
      </div>
      <ul>
        <?php 
          $posts = get_posts('category=4&orderby=post_date&order=DESC&numberposts=-1'); 
          $count = 1;
          foreach($posts as $post){
            if(get_field('popular_product') && $count<=5){
        ?>
          <li><a href="<?php echo get_permalink(); ?>"><?php echo $post->post_title ?></a></li>
        <?php $count++; }} ?>
      </ul>
    </div>
    <div class="second-col">
      <div class="head">
        <div class="icon"></div>
        <h3>Latest News</h3>
      </div>
      <?php 
        $posts = get_posts('category=1&orderby=post_date&order=DESC&numberposts=3'); 
        foreach($posts as $post){
      ?>
      <h4><?php echo date('d/n/Y', strtotime($post->post_date)); ?></h4>
      <p>
      <?php 
        $mycontent = getWords($post->post_content, 20);
        echo apply_filters('the_content()', $mycontent); 
      ?>
        <a href="<?php echo get_permalink() ?>">Read More</a>
      </p>
      <?php } ?>
    </div>
    <div class="second-col">
      <div class="head">
        <div class="icon"></div>
        <h3>About Us</h3>
      </div>
      <?php
        $posts = get_posts('post_parent=5&orderby=post_date&order=DESC&numberposts=1&post_type=page');
        foreach($posts as $post){
      ?>
      <p><?php echo strip_tags(getWords($post->post_content,100),'<p>') ?></p>
      <a href="<?php echo get_permalink(5) ?>">Read More</a>
      <?php } ?>
    </div>
  </div>
</div>

<?php get_footer(); ?>
